import React, { useState } from "react";
import {
  Card,
  Typography,
  Space,
  Button,
  List,
  Tag,
  Spin,
  Empty,
  Alert,
  Divider,
} from "antd";
import {
  RobotOutlined,
  BulbOutlined,
  ThunderboltOutlined,
  LoadingOutlined,
} from "@ant-design/icons";
import styled from "styled-components";
import type { ClassPerformance, StudentPerformance } from "../types";

const { Title, Text, Paragraph } = Typography;

const StyledCard = styled(Card)`
  margin-bottom: 24px;
  .ant-card-head-title {
    font-weight: bold;
  }
`;

const SuggestionItem = styled.div`
  padding: 16px;
  background: #f5f5f5;
  border-radius: 8px;
  margin-bottom: 16px;
`;

interface AIAnalysisProps {
  classPerformance?: ClassPerformance;
  studentPerformance?: StudentPerformance;
  studentName?: string;
}

const AIAnalysis: React.FC<AIAnalysisProps> = ({
  classPerformance,
  studentPerformance,
  studentName,
}) => {
  const [loading, setLoading] = useState(false);
  const [suggestions, setSuggestions] = useState<{
    teaching?: string[];
    improvement?: string[];
    resources?: string[];
  }>({});

  // 生成教学建议
  const generateSuggestions = async () => {
    setLoading(true);
    // TODO: 替换为实际的 AI API 调用
    setTimeout(() => {
      if (classPerformance) {
        // 班级整体分析
        setSuggestions({
          teaching: [
            '针对"操作系统"知识点的掌握程度普遍较低，建议增加相关习题讲解和实践机会',
            "成绩分布呈现两极化趋势，建议采用分层教学方法，关注中等生的提升",
            "建议组织优秀学生进行经验分享，促进同伴互助学习",
          ],
          improvement: [
            "为成绩落后的学生制定个性化辅导计划",
            "增加课堂互动和实践环节，提高学生参与度",
            "定期进行知识点回顾和巩固",
          ],
          resources: [
            "推荐在线编程实践平台：LeetCode、牛客网",
            "推荐补充学习资料：《操作系统概念》、《嵌入式系统设计》",
            "建议观看相关视频教程：MIT 操作系统公开课",
          ],
        });
      } else if (studentPerformance) {
        // 个人分析
        setSuggestions({
          teaching: [
            `针对${studentName}在操作系统方面的薄弱环节，建议安排一对一辅导`,
            "根据学习曲线，建议调整作业难度，循序渐进",
            "关注学生的学习积极性，适时给予鼓励和表扬",
          ],
          improvement: [
            "建议制定每周学习计划，合理分配时间",
            "加强基础知识的巩固和练习",
            "建议参加课外学习小组，与同学互相交流",
          ],
          resources: [
            "推荐针对性练习题集",
            "推荐在线视频教程和实践项目",
            "建议参考优秀同学的学习方法和经验",
          ],
        });
      }
      setLoading(false);
    }, 2000);
  };

  return (
    <div>
      <StyledCard
        title={
          <Space>
            <RobotOutlined />
            <span>AI 分析与建议</span>
          </Space>
        }
        extra={
          <Button
            type="primary"
            icon={<ThunderboltOutlined />}
            onClick={generateSuggestions}
            loading={loading}
          >
            生成建议
          </Button>
        }
      >
        {loading ? (
          <div style={{ textAlign: "center", padding: "40px 0" }}>
            <Spin
              indicator={<LoadingOutlined style={{ fontSize: 24 }} spin />}
              tip="正在分析数据，生成建议..."
            />
          </div>
        ) : !suggestions.teaching ? (
          <Empty
            description={<span>点击&quot;生成建议&quot;按钮开始 AI 分析</span>}
          />
        ) : (
          <Space direction="vertical" style={{ width: "100%" }}>
            <div>
              <Title level={5}>
                <BulbOutlined /> 教学建议
              </Title>
              <List
                dataSource={suggestions.teaching}
                renderItem={(item) => (
                  <SuggestionItem>
                    <Paragraph style={{ marginBottom: 0 }}>{item}</Paragraph>
                  </SuggestionItem>
                )}
              />
            </div>

            <Divider />

            <div>
              <Title level={5}>
                <BulbOutlined /> 改进建议
              </Title>
              <List
                dataSource={suggestions.improvement}
                renderItem={(item) => (
                  <SuggestionItem>
                    <Paragraph style={{ marginBottom: 0 }}>{item}</Paragraph>
                  </SuggestionItem>
                )}
              />
            </div>

            <Divider />

            <div>
              <Title level={5}>
                <BulbOutlined /> 推荐资源
              </Title>
              <List
                dataSource={suggestions.resources}
                renderItem={(item) => (
                  <SuggestionItem>
                    <Paragraph style={{ marginBottom: 0 }}>{item}</Paragraph>
                  </SuggestionItem>
                )}
              />
            </div>

            <Alert
              message="AI 建议仅供参考"
              description="以上建议由 AI 根据数据分析生成，请结合实际情况合理使用。"
              type="info"
              showIcon
            />
          </Space>
        )}
      </StyledCard>
    </div>
  );
};

export default AIAnalysis;
